<template>
  <el-table :data="tranList"
            style="width: 100%"
            @selection-change="selectionChange"
  >
    <el-table-column type="selection" width="55" />
    <el-table-column type="index" label="序号" width="80"/>
    <el-table-column property="tranNo" label="交易流水号" >
      <template #default="scope">
        <a href="javascript:" @click="view(scope.row.id)">{{scope.row.tranNo}}</a>
      </template>
    </el-table-column>
    <el-table-column property="cluePO.fullName" label="客户姓名" />
    <el-table-column property="money" label="金额" />
    <el-table-column property="expectedDate" label="预计成交时间"/>
    <el-table-column property="dicValPO.typeValue" label="交易阶段"/>
    <el-table-column property="description" label="交易描述"/>
    <el-table-column property="nextContactTime" label="下次联系时间" />
    <el-table-column label="操作">
      <!--使用插槽获取用户信息-->
      <template #default="scope">
        <el-button type="primary" @click="view(scope.row.id)">详情</el-button>
      </template>
    </el-table-column>
  </el-table>
  <p></p>
  <p></p>
  <p></p>
  <el-pagination
      class="page"
      background
      :page-size=pageSize
      layout="prev, pager, next"
      @current-change="page"
      @prev-click="page"
      @next-click="page"
      :total=total />
</template>

<script>
import {doGet} from "@/http/httpRequest";

export default {
  name : "TranView",
  data(){
    return{
      tranList : [],
      pageSize : 0,
      total:0,
    }
  },
  methods:{
    loadTranList(current){
      doGet("api/loadTranList",{
        current : current
      }).then(res =>{
        if (res.data.code === 200) {
          this.tranList = res.data.data.list;
          this.pageSize = res.data.data.pageSize;
          this.total = res.data.data.size;
        }
      })
    },
    view(id){
      this.$router.push('/hello/tranDetails/' + id)
    }
  },
  mounted() {
    this.loadTranList(1);
  }

}
</script>



<style scoped>

</style>